<template>
  <div>
    <el-card>
      <el-form inline :model="work" ref="frmData"  >
        <el-form-item label="名称：" class="mgb-0" prop="fname">
          <el-input v-model="work.fname" ></el-input>
        </el-form-item>
        <el-form-item label="编码：" class="mgb-0" prop="fnumber">
          <el-input v-model="work.fnumber"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" @click="handle_search()">搜索</el-button>
          <el-button type="primary" icon="el-icon-refresh" @click="handle_clear()">清除</el-button>
        </el-form-item>
      </el-form>
    </el-card>
    <el-card style="margin-bottom: 10px">
      <div style="margin-bottom: 10px">
        <el-button type="primary" @click="handle_add">新增</el-button>
        <el-button type="primary"@click="batchEnable(0)">启用</el-button>
        <el-button type="primary" @click="batchEnable(1)">禁用</el-button>
        <el-button type="danger" @click="batch_delete">批量删除</el-button>
      </div>

      <el-table :data="pages.rows" ref="ref" style="width: 100%" v-loading="tableLoading">
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column type="index" width="55"></el-table-column>
        <el-table-column label="名称" prop="fname"></el-table-column>
        <el-table-column label="状态" prop="fstatus" required>
          <template slot-scope="scope">
            <el-tag type="danger" v-if="scope.row.fstatus=='AUX'">禁用</el-tag>
            <el-tag type="success" v-if="scope.row.fstatus=='BASE'">启用</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="编码" prop="fnumber"></el-table-column>
        <el-table-column label="备注" prop="fdescription"></el-table-column>
        <el-table-column label="创建用户" prop="fcreatorid"></el-table-column>
        <el-table-column label="创建时间" prop="fcreatetime"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button type="text" @click="handle_datil(scope.row)">详情</el-button>
            <el-button type="text" v-if="scope.row.fstatus=='AUX'" @click="handle_edit(scope.row)">编辑</el-button>
            <el-button type="text" style="color: red" @click="handle_del(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        style="float: right;margin: 10px 0;"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pages.page"
        :page-sizes="[10, 20, 30, 50]"
        :page-size="pages.pageSize"
        layout="total,sizes,prev,pager,next,jumper"
        prev-text="上一页"
        next-text="下一页"
        :total="pages.totalRows">
      </el-pagination>
    </el-card>
     <addEdit_work v-if="showPage.addEdit" :fid="fid" :status="status" :workAdd="workshop" @close="handle_close($event)"></addEdit_work>
  </div>
</template>

<script>
import Work from "@/api/workshopManager/Work";
import addEdit_work from "@/views/workshopManager/components/addEdit_work";
export default {

  name: "workShop",
  components:{
   addEdit_work,
  },
  data() {
    return {
      work: {
        fname: '',
        fnumber: '',
        fstatus:'',
        fcreatetime:null,
        fcreatroid:''
      },

      tableLoading: false,
      pages: {
        rows: [],
        page: 1,//当前页数
        pageSize: 10,//当前条数
        totalRows: 0,//总条数

      },
      showPage: {
        addEdit: false,

      },
      status:'',
      workshop: {},

    }

  },

  created() {
    this.init();
  },

  methods: {
    init() {
      this.tableLoading = true;
      const ne= new Work();
      ne.queryListPage(this._getData()).then(res => {
        this.tableLoading = false;
        this.pages = res.data;
        console.log(this.pages);
        console.log(this.pages.rows);
      })
    },
    // 当前页数修改时
    handleSizeChange(pageSize) {
      this.pages.pageSize = pageSize
      this.init();
    },
    // 当前页码修改时
    handleCurrentChange(page) {
      this.pages.page = page
      this.init();
    },
    handle_del(){
      this.$confirm('此操作将永久删除该文件, 是否继续?','提示',{
        comfirmButtonText:'确定',cancelButtonText: '取消', type: 'warning'
      }).then(()=>{
        const api=new Work();
        api.delete(this.workshop.fparentid).then(()=>{
          this.init();
        })
      })
    },
    _getData() {
      const data = this.work;
      data.page = this.pages.page;
      data.pageSize = this.pages.pageSize;
      return data;
    },
    handle_search(){
    this.init();
    },
    handle_datil(data){
      console.log(data)
      this.fid=data.fid
      console.log(this.fid);
      this.status='view'
      this.workshop=data;
      this.showPage.addEdit=true;

    },
    handle_edit(data){
      console.log(data)
      this.fid=data.fid
      this.status='edit'
      this.workshop=data;
      this.showPage.addEdit=true;
    },
    handle_clear(){
      this.$refs['frmData'].resetFields();
      this.init();
    },
    batch_delete(){

      const selectData=this.$refs.ref.selection
      if (selectData.length<1){
        this.$tie.showError('请至少选择一条数据')
        return
      }
      console.log(selectData)
      const ids= selectData.map(i=>i.id)
      const api = new Work();
      api.batchDelete(ids).then(res => {
        this.$tie.showSuccess(res.message)
        this.init();
      })
    },

    handle_add(){
      this.fid=null
      this.status='add'
      this.showPage.addEdit=true;

    },
    handle_close(obj){
      if(obj.name==="addEdit"){
        this.showPage.addEdit=false;
      }
      if(obj.name==="update"){
        this.showPage.update=false;
      }
      if (obj.name === 'detail') {
        this.showPage.detail = false;
      }
      if(obj.isRefresh){
        this.init();
      }
      console.log(obj)
    },
    _loading(){

    },
    getSelectIdByTable () {
      var batchChoose = this.$refs.ref.selection;
      var fids = [];
      for (var i = 0; i < batchChoose.length; i++) {
        fids[i] = batchChoose[i].fid;
      }
      return fids;
    },
   //批量启用,禁用
    batchEnable(status){
      var fids = this.getSelectIdByTable();
      if(fids.length==0){
        this.$tie.showError('请至少选择一条数据！')
        return false;
      }
      const loading = this.$loading({
        lock: true,
        text: `批量操作中，请耐心等待.....`,
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });

      let http = new Work();
      http.batchEdit({ "fid": fids, "fstatus": status }).then(res => {
        this.$tie.showSuccess(res.message)
        loading.close();
        this.init();
        this.getData()
      }).catch(e => {
        loading.close();
      })
    },
    /*
    //批量禁用
    batchDisenable(status){
      const _selectData = this.$refs.iTable1.selection
      if(_selectData.length==0){
        this.$tie.showError('请至少选择一条数据！')
        return
      }
      console.log(_selectData)
      const resData = _selectData.map(i => {
        return Object.assign({}, {
          "fid": i.fid,
          "fstatus": status
        })
      });
      let http = new Psy();
      const loading = this._loading();
      console.log(resData)
      http.batchEdit(resData).then(res => {
        console.log(res)
        loading.close()
        this.initGroup();
        this.getData()
      }).catch(e => {
        loading.close()
      })
    },
 * */
  }
}
</script>

<style scoped>

</style>
